// 包括三种:发布者,订阅者和事件中心

// 1.Vue自定义事件
let vm = new Vue();
vm.$on("dataChange", () => {
  console.log("dataChange");
});
vm.$emit("dataChange");

// 兄弟组件的通信过程

// eventBus.js
// 事件中心
let eventBus = new Vue()

addTodo: function(){
  // 发布消息
  eventHub.$emit('add-todo',{ text:this.newTodoText })
  this.newTodoText = ''
}

// 订阅消息
created:function() {
  // 订阅消息
  eventBus.$on('add-todo',this.addTodo)
}

// 模拟Vue自定义事件的实现
// 事件触发器
class EventEmitter {
  // 定义一个属性记录事件和事件对应的构造函数
  constructor () {
    // 对象的原型设置为null,不需要原型,传null可以提升性能
    // {'click':[fn1,fn2]}
    this.subs = Object.create(null)
  }
  // 注册事件
  $on (eventType,handler) {
    // 找到属性往属性的数组里面push函数
    // 找不到的时候就创建一个新数组
    // 有,返回原本的值;没有,返回空数组
    this.subs[eventType] =  this.subs[eventType] || []
    this.subs[eventType].push(handler)
  }
  // 触发事件 
  $emit(eventType) {
    if (this.subs[eventType]) {
      this.subs[eventType].forEach(handler => {
        handler()
      })
    }
  }
}